﻿@using System.Web.Script.Serialization
@{
    ViewBag.Title = "ShowOther";
    Layout = "~/views/Shared/_Layout.cshtml";
}

@Styles.Render("~/content/statuses.css")
<div>
    
                  <a data-bind="click:listStatus" >all status</a>
                  <a data-bind="click:listProductStatus">all product </a>
            </div>

<div class="statuses_list" data-bind="visible:Messages().length>0" style="display: none">
                
                <ul class="media-list">
                    <!-- ko foreach: Messages-->
                    <li class="media">
                        <a class="pull-left" href="#">
                            <img data-bind="attr:{src: CustomerLogoUrl}" class="media-object" />
                        </a>
                        <div class="media-body ">
                            <h4 class="media-heading"></h4>

                            <div class="comment-content" style="float: left" data-bind="attr:{link:'/status/' +Id()},click:GoOnePageProduct">
                                <span data-bind="html:Text"></span>
                                <!-- ko if: IsProduct-->
                                <div>
                                    <span data-bind="text:ProductStock"></span>
                                    <span data-bind="text:ProductPrice"></span>
                                </div>
                                <!-- /ko -->

                                <!-- ko foreach: Pics-->
                                <div class="comment-pictures">
                                    <img data-bind="attr:{src: PicUrl},click:ShowOriginalPic" />
                                </div>
                                <!-- /ko -->

                                <ul class="status-tagedit-list " style="border: 0px">
                                    <!-- ko foreach: Tags-->
                                    <li class="tagitem" 
                                        data-bind="text:TagName"></li>
                                    <!-- /ko -->
                                  
                                   
                                </ul>

                            </div>
                            <div class="operation">
                            </div>
                        </div>
                    </li>

                    <!-- /ko -->
                </ul>

                <div class="row-fluid">
                    <input type="button" value="More" data-bind="click:MoreStatus,visible:Messages().length>0" class="btn btn-default btn-block" />
                </div>
            </div>

@{
    var model = ViewBag.Model;
    var jsonStr = new HtmlString(new JavaScriptSerializer().Serialize(model));
}
@section scripts
{
    
        <script src="~/Scripts/statuses/Statuses.js"></script>
    <script src="~/Scripts/statuses/tags.js"></script>

    <script>

        var init = @jsonStr;
        
        function PageInfo(customerId, pageIndex, pageSize) {
            var self = this;
            self.CustomerId = ko.observable(customerId);
            self.PageIndex = ko.observable(pageIndex);
            self.PageSize = ko.observable(pageSize);
            self.NextPage = function() {
                return new PageInfo(customerId, pageIndex + 1, pageSize);
            };
            self.FirstPage = function() {
                self.PageIndex(0);
                return new PageInfo(customerId, self.PageIndex(), pageSize);
            };
        }


        function HomeTimeLineModel() {

            var self = this;
            
            var tempMessages = $.isEmptyObject(init.StatusList) ? [] : $.map(init.StatusList, function(a) {
                var tempPics = $.isEmptyObject(a.StatusPictures) ? [] : $.map(a.StatusPictures, function(p) {
                    return new StatusPictureModel(p.PicId, p.PicUrl);
                });
                var productStock = a.ProductStatus == null ? "" : a.ProductStatus.ProductStock;
                var productPrice = a.ProductStatus == null ? "" : a.ProductStatus.ProductPrice;
                var productId = a.ProductStatus == null ? "" : a.ProductStatus.ProductId;

                var tempTags = $.isEmptyObject(a.StatusTags) ? [] : $.map(a.StatusTags, function(p) {
                    return new TagModel(p.TagName, p.TagValue);
                });
                return new StatusListItemModel(a.Id, a.CreatedAt, a.Text, a.CustomerId, a.Deleted, a.CustomerName, a.CustomerLogoUrl, a.CustomerEmail, tempPics, a.IsProductStatus, productStock, productPrice, productId,
                    tempTags);
            });

            self.Messages = ko.observableArray(tempMessages);
            self.PageInfo = new PageInfo(init.CustomerId, 0, 5);
            var listModeEnum = {
                ListStatus :0,
                ListProductStatus :1
            };

            self.ListMode = ko.observable(listModeEnum.ListStatus);
            
            self.listProductStatus = function() {

                self.ListMode(listModeEnum.ListProductStatus);

                self.PageInfo = self.PageInfo.FirstPage();
                $.ajax({
                    url: "/api/StatusApi/HomeLineProduct",
                    type: 'post',
                    async: false,
                    data: ko.toJSON(self.PageInfo),
                    contentType: 'application/json',
                    success: function(result) {

                        if (result.Status == "0") {
                            var statusList = result.StatusList;

                            vm.Messages([]);

                            $.each(statusList, function(index, a) {
                                var tempPics = $.isEmptyObject(a.StatusPictures) ? [] : $.map(a.StatusPictures, function(p) {
                                    return new StatusPictureModel(p.PicId, p.PicUrl);
                                });

                                var productStock = a.ProductStatus == null ? "" : a.ProductStatus.ProductStock;
                                var productPrice = a.ProductStatus == null ? "" : a.ProductStatus.ProductPrice;
                                var productId = a.ProductStatus == null ? "" : a.ProductStatus.ProductId;

                                var tempTags = $.isEmptyObject(a.StatusTags) ? [] : $.map(a.StatusTags, function(p) {
                                    return new TagModel(p.TagName, p.TagValue);
                                });

                                vm.Messages.push(new StatusListItemModel(a.Id, a.CreatedAt, a.Text, a.CustomerId, a.Deleted, a.CustomerName, a.CustomerLogoUrl, a.CustomerEmail, tempPics, a.IsProductStatus, productStock, productPrice, productId, tempTags));


                            });

                        } else {
                            //alert("保存失败：" + result.Msg);
                        }
                    }
                });
            };
            self.listStatus = function() {
                self.ListMode(listModeEnum.ListStatus);

                self.PageInfo = self.PageInfo.FirstPage();
                $.ajax({
                    url: "/api/StatusApi/HomeLine",
                    type: 'post',
                    async: false,
                    data: ko.toJSON(self.PageInfo),
                    contentType: 'application/json',
                    success: function(result) {

                        if (result.Status == "0") {
                            var statusList = result.StatusList;

                            vm.Messages([]);

                            $.each(statusList, function(index, a) {
                                var tempPics = $.isEmptyObject(a.StatusPictures) ? [] : $.map(a.StatusPictures, function(p) {
                                    return new StatusPictureModel(p.PicId, p.PicUrl);
                                });

                                var productStock = a.ProductStatus == null ? "" : a.ProductStatus.ProductStock;
                                var productPrice = a.ProductStatus == null ? "" : a.ProductStatus.ProductPrice;
                                var productId = a.ProductStatus == null ? "" : a.ProductStatus.ProductId;

                                var tempTags = $.isEmptyObject(a.StatusTags) ? [] : $.map(a.StatusTags, function(p) {
                                    return new TagModel(p.TagName, p.TagValue);
                                });

                                vm.Messages.push(new StatusListItemModel(a.Id, a.CreatedAt, a.Text, a.CustomerId, a.Deleted, a.CustomerName, a.CustomerLogoUrl, a.CustomerEmail, tempPics, a.IsProductStatus, productStock, productPrice, productId, tempTags));


                            });

                        } else {
                            //alert("保存失败：" + result.Msg);
                        }
                    }
                });
            };
            self.MoreStatus = function() {
                var url = "";
                if (self.ListMode() == listModeEnum.ListStatus) {
                    url = "/api/StatusApi/HomeLine";
                } else {
                    url = "/api/StatusApi/HomeLineProduct";
                }
                
                self.PageInfo = self.PageInfo.NextPage();
                $.ajax({
                    url:url,
                    type: 'post',
                    async: false,
                    data: ko.toJSON(self.PageInfo),
                    contentType: 'application/json',
                    success: function(result) {

                        if (result.Status == "0") {
                            var statusList = result.StatusList;

                            $.each(statusList, function(index, a) {
                                var tempPics = $.isEmptyObject(a.StatusPictures) ? [] : $.map(a.StatusPictures, function(p) {
                                    return new StatusPictureModel(p.PicId, p.PicUrl);
                                });

                                var productStock = a.ProductStatus == null ? "" : a.ProductStatus.ProductStock;
                                var productPrice = a.ProductStatus == null ? "" : a.ProductStatus.ProductPrice;
                                var productId = a.ProductStatus == null ? "" : a.ProductStatus.ProductId;

                                var tempTags = $.isEmptyObject(a.StatusTags) ? [] : $.map(a.StatusTags, function(p) {
                                    return new TagModel(p.TagName, p.TagValue);
                                });
                                vm.Messages.push(new StatusListItemModel(a.Id, a.CreatedAt, a.Text, a.CustomerId, a.Deleted, a.CustomerName, a.CustomerLogoUrl, a.CustomerEmail, tempPics, a.IsProductStatus, productStock, productPrice, productId, tempTags));


                            });

                        } else {
                            alert("保存失败：" + result.Msg);
                        }
                    }
                });
            };

        }
        
        var vm = new HomeTimeLineModel();

        ko.applyBindings(vm);
    </script>

}